<template>
  <div>
    <!--条件筛选-->
    <TopFilter ref="topFilter" :list="topFilterList" :cols="3" labelWidth="110" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <!-- table -->
    <FilterTable
      ref="table"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :isSelectColumn="false"
      :onRowSelectChange="selectChange"
      columnsRef="jzySeries"
      :isExportExcel2="true"
      :exportFileName="'电池故障信息.xlsx'"
      :onColumnsChange="columns => this.columns = columns"
    >
    </FilterTable>
    <Drawer
      :title="detil"
      :visible.sync="showdetil"
      :closable=true
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <detil :type="detilType" :rowData="detilData" @close="detilClose"/>
    </Drawer>
  </div>
</template>

<script>
  import { dictionary } from '@/utils/dictMixin';
  import detil from '@/pages/customerService/batteryfault/batterydealwith/detil.vue'
  import { getbatteryforstorylist } from '@/api/customerService/arbitration/index';
  const status=[
    {text: '未确认', value: 'A'},
    {text: '已确认', value: 'B'},
    {text: '未控车', value: 'C'},
    {text: '已控车', value: 'D'},
    {text: '处理中', value: 'E'},
    {text: '关闭', value: 'F'}
  ]
  const one=[
    {text: '车辆告警', value: '20'},
  ]
  const two=[
    {text: '一级推送', value: '1'},
    {text: '二级推送', value: '2'},
    {text: '弹屏', value: '3'},
  ]
    export default {
      name: "index",
      mixins: [dictionary],
      components:{
        detil
      },
      data() {
        return{
          showdetil:false,
          detilData:{},
          detil:'电池故障单处理明细',
          detilType:'',
          topFilterList: this.createTopFilterList(),
          columns: this.createTableColumns(),
          fetchApi: getbatteryforstorylist,
          fetchParams: {},
          dialogTitle:'',
          visibleDrawer: false,
          title: '新增',
          type:'',
          formData:{},
          rowSelectData: [],
          showAddNew:false,
        };
      },
      created() {
      },
      methods: {
        createTopFilterList() {
          return[
            {
              type: 'INPUT',
              label: 'VIN',
              fieldName: 'vin'
            },
            {
              type: 'INPUT',
              label: '工单号',
              fieldName: 'oemOrderId'
            },
            {
              type: 'SELECT',
              label: '工单状态',
              fieldName: 'status',
              itemList:status
            },
            {
              type: 'DATE',
              label: '故障提报日期',
              fieldName: 'errortime'
            },
            {
              type: 'INPUT',
              label: '车型',
              fieldName: 'series'
            }
          ]
        },
        // 查看明细
        dealwithdetil(row){
          this.detilData=row
          this.detilType='show'
          this.showdetil=true
        },
        detilClose(){
          this.showdetil=false
        },
        createTableColumns () {
          return [
            {
              title: '操作',
              dataIndex: 'column-action',
              width: 80,
              fixed: 'left',
              render: (props, h) => {
                return (
                  <div>
                    <el-button  size="mini" type="text" onClick={() => this.dealwithdetil(props.row)}>
                      明细
                    </el-button>
                  </div>
                );
              }
            },
            {
              title: '序号',
              dataIndex: 'index',
              width: 70,
              sorter: true,
              render: props => {
                return <span>{props.row.index + 1}</span>;
              }
            },
            {
              title: '工单号',
              dataIndex: 'oemOrderId',
              sorter: true,
            },
            {
              title: '工单状态',
              dataIndex: 'status',
              sorter: true,
              dictItems: status
            },
            {
              title: 'VIN',
              dataIndex: 'vin',
              sorter: true,
            },
            {
              title: '车型',
              dataIndex: 'series',
              sorter: true,
            },
            {
              title: '电池供应商',
              dataIndex: 'batterySupplier',
              sorter: true,
            },
            {
              title: '故障一级类别',
              dataIndex: 'casetypeOne',
              sorter: true,
              dictItems: one
            },
            {
              title: '故障二级类别',
              dataIndex: 'casetypeTwo',
              sorter: true,
              dictItems: two
            },
            {
              title: '经销商代码',
              dataIndex: 'dealerCode',
              sorter: true,
            },
            {
              title: '服务站名称',
              dataIndex: 'dealerName',
              sorter: true,
            },
            {
              title: '客户姓名',
              dataIndex: 'ownerName',
              sorter: true,
            },
            {
              title: '客户电话',
              dataIndex: 'custphone',
              sorter: true,
            },
            {
              title: '客户所在城市',
              dataIndex: 'custcity',
              sorter: true,
            },
            {
              title: '客户地址',
              dataIndex: 'custaddress',
              sorter: true,
            },
            {
              title: '故障编码',
              dataIndex: 'errorcode',
              sorter: true,
            },
            {
              title: '故障描述',
              dataIndex: 'errordesc',
              sorter: true,
            },
            {
              title: '补充描述',
              dataIndex: 'suppdesc',
              sorter: true,
            },
            {
              title: '故障推送日期',
              dataIndex: 'errortime',
              dateFormat: 'yyyy-MM-dd',
              sorter: true,
            },
            {
              title: 'ODO里程',
              dataIndex: 'mileage',
              sorter: true,
            },
            {
              title: '维修技师',
              dataIndex: 'maintenanceTechnician',
              sorter: true,
            },
            {
              title: '故障备注',
              dataIndex: 'faultRemarks',
              sorter: true,
            },
            {
              title: '创建人',
              dataIndex: 'createName',
              sorter: true,
            },
            {
              title: '创建时间',
              dataIndex: 'createdAt',
              dateFormat: 'yyyy-MM-dd hh:mm:ss',
              sorter: true,
            },
            {
              title: '修改人',
              dataIndex: 'updateName',
              sorter: true,
            },
            {
              title: '修改时间',
              dataIndex: 'updatedAt',
              dateFormat: 'yyyy-MM-dd hh:mm:ss',
              sorter: true,
            }
          ]
        },
        selectChange(val) {
          console.log('val', val);
          this.rowSelectData = val;
        },
        changeHandle(val) {
          this.fetchParams = Object.assign({}, val);
        },
        collapseHandle() {
          this.$nextTick(() => {
            this.BaseTable.EXECUTE_RESET_HEIGHT();
          });
        },
      }
    }
</script>

<style scoped>

</style>
